<template>
	<view class="page">
		<view class="group" >
			<view class="group-item" v-for="(item,index) in groupList" :key='index'>
				<label class="radio" style="margin-right: 30rpx;" @tap='change(item.group_id)'>
					<radio :checked="checked==item.group_id ? 'checked':''" color="#4CD964"/>{{item.group_name}}
				</label>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				groupList:[],
				id:'',
				checked:0
			}
		},
		onLoad(option) {
			this.id = option.id
			this.checked = option.gid
			this.getGroupList();	
		},
		methods: {
			getGroupList(){
				let userinfo = uni.getStorageSync('userinfo');
				uni.showLoading({
					title:"加载中"
				})
				this.$api.interfaceApi('getGroup')({
					uid:userinfo.id
				}).then(res=>{
					this.groupList = res.data
					console.log(this.groupList);
					uni.hideLoading()
				})
			},
			change(index){
				this.checked = index
				this.$api.interfaceApi('moveGroup')({
					id:this.id,
					gid:this.checked
				}).then(res=>{
					uni.showToast({
						icon:"none",
						title:res.msg
					})
				})
			},
			
		}
	}
</script>

<style lang="less">
	.page{
		padding: 50rpx;
		.group{
			padding: 50rpx;
			background-color: #FFFFFF;
			border-radius: 20rpx;
			.group-item{
				margin: 20rpx 0;
			}
		}
	}
</style>
